<template>
    <div>
        <div style="margin-top: 15px;display: flex;justify-content: space-between;">
            <el-form :inline="true" :model="forObject" class="demo-form-inline" >
                <el-form-item>
                    <el-input v-model="forObject.name" placeholder="姓名"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="page">查询</el-button>
                    <el-button type="primary" icon="el-icon-bottom">高级搜索</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div>
            <ElementTable ref="pageTable"
                          :pageColumns="pageColumns"
                          :optBtn="optBtn"
                          :btnList="btnList"
                          :optWidth=230
                          :url="url"
                          :formObject="forObject"
                          :loading="loading"
                          @optClick="optClick"
                          @btnListClick="btnListClick"
            >

            </ElementTable>
        </div>
        <SysUserEdit ref="refSysUserEdit" @page="page"></SysUserEdit>
    </div>

</template>

<script>
    import ElementTable from '../../../components/base/ElementTable'
    import SysUserEdit from './SysUserEdit'
    export default {
        name: "SysUser",
        components:{
            ElementTable,
            SysUserEdit
        },
        mounted() {
            this.page()
        },
        data(){
            return{
                selectIds:[],
                forObject:{
                    name:undefined
                },
                btnList:[
                    {icon:'el-icon-plus',type:'success',name:'导入数据',id:'menu-sys-menu-bath-import'},
                    {icon:'el-icon-plus',type:'success',name:'导出数据',id:'menu-sys-menu-bath-export'},
                    {icon:'el-icon-plus',type:'primary',name:'新增用户',id:'menu-sys-menu-bath-add'}
                ],
                url:'/api/sys_user/page_vo',
                loading:true,
                pageColumns:[
                    {key:'name',title:'姓名',width:200},
                    {key:'username',title:'用户名',width:200},
                    {key:'age',title:'年龄',width:160},
                    {key:'sex',title:'性别',width:160},
                    {key:'phone',title:'电话',width:300}
                ],
                optBtn:[
                    {icon:'el-icon-edit',name:'编辑',id:''},
                    {icon:'el-icon-delete',name:'删除',id:''},
                ],
                getPage: {},
            }
        },
        methods:{
            optClick(data){
               switch (data.name) {
                   case '编辑':
                       this.addUser(data.obj.id)
                       break
                   case 'selectData':
                       let ids = []
                       if (data.obj.length==0){
                           this.selectIds=[]
                       }else {
                           data.obj.forEach(function (item,value) {
                               ids[value]=item.id
                           })
                       }
                       this.selectIds = ids
                       break
               }
            },
            btnListClick(name){
                switch (name) {
                    case '新增用户':
                        this.addUser()
                        break
                }
            },
            addUser(id){
                this.$refs.refSysUserEdit.open(id)
            },

            page(){
                this.$refs.pageTable.page()
            }
        }
    }
</script>

<style scoped>

</style>